class InlineModal {
     static panel

    static show(context, position) {
        if (this.panel) {
            this.panel.reveal();
            return;
        }

        // 创建无边框 Webview
        const panel = vscode.window.createWebviewPanel(
            'inlineModal',
            'Color Picker',
            { viewColumn: vscode.ViewColumn.Active, preserveFocus: true },
            {
                enableScripts: true,
                retainContextWhenHidden: true,
                enableFindWidget: false,
                // 关键配置：透明背景、无边框
                enableCommandUris: false,
                enableForms: false
            }
        );

        // 动态计算位置
        const editor = vscode.window.activeTextEditor;
        const lineHeight = editor?.options.lineHeight || 20;
        const top = position.line * lineHeight;
        const left = position.character * 8; // 假设字符宽度为8px

        // 注入定位样式
        panel.webview.html = `
            <html>
            <head>
                <style>
                    body {
                        margin: 0;
                        padding: 10px;
                        background: var(--vscode-editor-background);
                        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
                        position: absolute;
                        top: ${top}px;
                        left: ${left}px;
                        z-index: 9999;
                        border-radius: 4px;
                    }
                    input[type="color"] {
                        width: 120px;
                        height: 30px;
                    }
                </style>
            </head>
            <body>
                <input type="color" id="colorPicker">
                <script>
                    document.getElementById('colorPicker').addEventListener('change', (e) => {
                        vscode.postMessage(e.target.value);
                    });
                </script>
            </body>
            </html>
        `;

        // 处理消息
        panel.webview.onDidReceiveMessage(color => {
            vscode.commands.executeCommand('colorPicker.insert', color);
            panel.dispose();
        });

        panel.onDidDispose(() => {
            this.panel = null;
        });

        this.panel = panel;
    }
}